<html>
	<head>
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
		<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true">
		</script>
		<script type="text/javascript">
			var map;
			var marker;
			function initialize() {
			var myLatlng = new google.maps.LatLng(36.81258338428396, 10.156345492431683);
			var myOptions = {
			zoom: 7,
			center: myLatlng,
			mapTypeId: google.maps.MapTypeId.ROADMAP
			}
			map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
			
			google.maps.event.addListener(map, 'click', function(event) {
			placeMarker(event.latLng);
			});
			}
			function placeMarker(location) {
			if(marker!=null){
			marker.setVisible(false);
			}
			//var clickedLocation = new google.maps.LatLng(location);
			marker = new google.maps.Marker({
			position: location, 
			map: map
			});
			
			map.setCenter(location);
			
			document.getElementById("pos").value =location;	
			}
		</script>
	</head>
	<body onload="initialize()">
		<div id="map_canvas" style="width:500px; height:500px">
		</div>
		<form method="GET" action="">
		  <input id="pos" name="pos" type="text" />
		  <input type="submit" value="Submit" />
		</form>
	</body>
</html>
